﻿*, *::after, *::before {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.right-container{
	margin-left: 330px;
}
.t-list{
	overflow: hidden;
	padding: 0;
}

.status-bar{
	position: absolute;
	right: 10px;
	top: 10px;
	z-index: 999;
	width: 36px;
	height: 36px;
}

#btn-open{
	float: right;
}
/*设备故障闪烁效果*/
.className{
-webkit-animation: twinkling 1s infinite ease-in-out
}
.animated{
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
@-webkit-keyframes twinkling{
0%{
opacity: 0.5;
}
100%{
opacity: 1;
}
}
@keyframes twinkling{
	0%{
	opacity: 0.5;
	}
	100%{
	opacity: 1;
	}
}

@keyframes blink{
	0%{opacity: 1;}
	50%{opacity: 1;}
	50.01%{opacity: 0;} /* 注意这里定义50.01%立刻透明度为０，可以设置闪烁效果 */
	100%{opacity: 0;}
}

/* 添加兼容性前缀 */

@-webkit-keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 1; }
	50.01% { opacity: 0; }
	100% { opacity: 0; }
}

@-moz-keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 1; }
	50.01% { opacity: 0; }
	100% { opacity: 0; }
}

@-ms-keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 1; }
	50.01% { opacity: 0; }
	100% { opacity: 0; }
}

@-o-keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 1; }
	50.01% { opacity: 0; }
	100% { opacity: 0; }
}

/* 定义blink类*/
/*.blink{*/
/*animation: blink .75s linear infinite;*/
/*/!* 其它浏览器兼容性前缀 *!/*/
/*-webkit-animation: blink .75s linear infinite;*/
/*-moz-animation: blink .75s linear infinite;*/
/*-ms-animation: blink .75s linear infinite;*/
/*-o-animation: blink .75s linear infinite;*/
/*color: #dd4814;*/
/*}*/
#floor-list{
	text-align: center;
	height: 100%;
	background-color:#f0f0f0;
}
.center_td{
	position: absolute;
	left: 180px;
	top: 0;
	z-index: 2;
	/*background-color: #f2f2f2;*/
	/*box-shadow: 2px 2px 3px #ccc;*/
	/*height: 100%;*/
	/*color: #000;*/
	/*width: 150px;*/
	/*overflow: hidden;*/
}
.search input{
	width: 100%;
	padding:10px 0;
	/*width: 110px\9;*/
	text-align:center;
	color: #fff;
	border: 0;
	background: #515158;
	/*border: 1px solid #CCCCCC;*/
	border-radius: 0;
}
.center_td #device-list{
	margin-top: 10px;
	width: 80px;
}
.center_td #device-list .device-item{
	display: inline-block;
	padding: 0.5em 5px;
	color: #aaa;
	text-align: left;
	font-size: 12px;
	font-weight: 600;
}
.center_td #device-list .device-item.cur{
	color: #515158;
}

.center_td #device-list .device-item:hover{
	color: #515158;

}
.center_td .title{
	color: #dc4b7c;
	text-align: center;
	padding: 6px 0;
	font-size: 13px;
	font-weight: 800;
	box-sizing:content-box;
}
.center_td .content{
	font-size: 13px;
}
.center_td .t-list-btns{
	margin-top: 0;
}
.device_state{
	border-bottom: 1px solid #ccc;
}
.device_state ul li{
	line-height: 24px;
	padding-left: 10px;
}
.device_state ul li span{
	margin-right: 6px;
}

.floor-image-bg1{
	background: url("../../../assets/img/building/floor-1.png") no-repeat center top;
	background-size: auto 100%;
}
ul.floorMenu  li{
	line-height: 24px;


}
ul.floorMenu  li a{
	color: #aaa;
	display: block;
	text-align: center;
	width:50px;
	-webkit-transition: all;
	transition: all;
	-webkit-transition-timing-function: linear;
	transition-timing-function: linear;
	-webkit-transition-duration: .2s;
	transition-duration: .2s;
	border-bottom:1px solid #ccc;
	font-size: 12px;
	font-weight: 600;
}
ul.floorMenu  li a:hover{
	/*font-weight: 800;*/
	/*background-color: #f1f5f8;*/
	padding-left: 20px;
	/*color: #FFFFFF;*/
}
ul.floorMenu  li a.cur{
	/*font-weight: 800;*/
	/*background-color: #f1f5f8;*/
	padding-left: 20px;
	color: #000;
	/*color: #FFFFFF;*/
}

.info-box{
	display: none;
	position: absolute;
	width: 100%;
	height: 200px;
	margin:0;
	top: auto;
	bottom: 0;
	-webkit-transform: translateY(100%);
	-moz-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
	background-color: #fff;
}

.info-box.show{

	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	transform: translateY(0px);
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
}
.device-coordinate-item a img{
	width: 100%;
	/*width: 22px\9;*/
	opacity: 0.7;
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
	/*display: none;*/
}
.menjin{
	width: 3%;
	line-height: 3vmin;
	/*height: 4vmin;*/
	/*width: 20px\9;*/
	/*height: 23px\9;*/
	font-size: 0;
	vertical-align: middle;
	text-align: center;
}


.t-building .floor-image{
	-webkit-transition-timing-function: linear;
	transition-timing-function: linear;
	-webkit-transition-duration: .2s;
	transition-duration: .2s;
	z-index: 2;
}
.t-building .floor-image > img{
	height: 100%;
	display:block;
}
.icon--pin{
	width: 16px;
	height: 16px;
}
.img-title{
	z-index: 9;
	position: absolute;
	top: 0;
	font-size: 12px;
	margin: 10px;
	width: 350px;
	z-index: 1;
}
.img-bottom{
	z-index: 9;
	position: absolute;
	top: 93%;
	font-size: 12px;
	margin: 20px;
	width: 350px;
}
.img-title .item{
	width: 26%;
	display: inline-block;
}

.img-title img{
	width: 15px;
	float: left;

}
.img-title .item span{
	margin-top: 4px;
	margin-left: 3px;
	display: block;
	float: left;
	width: 80%;
}
a.menjin:hover img{
	opacity: 1;
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
	box-shadow: 6px 6px 10px #666666;
}
a.menjin.cur img{
	opacity: 1;
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
	box-shadow: 6px 6px 10px #666666;
}
.shipin{
	width: 3%;
	line-height: 4vmin;
	font-size: 0;
	vertical-align: middle;
	text-align: center;

}
a.shipin:hover{
	z-index: 999;
}
a.shipin.cur{
	z-index: 999;
}
a.shipin:hover img{
	opacity: 1;
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
	box-shadow: 6px 6px 10px #f0f0f0;
	width: 110%;
}
a.shipin.cur img{
	opacity: 1;
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
	box-shadow: 6px 6px 10px #f0f0f0;
	width: 110%;
}

.videoInfo{
	overflow: auto;
	padding-left:20px;
	padding-bottom: 20px;
}
.videoInfo ul{
	width:70%
}
.videoInfo ul li{
	width: 50%;
}
.downloadedBtn{
	position: absolute;
	z-index: 999;
	top: 50%;
	left: 45.5%;
	color: blue;
}
#deviceInfo{
	float: left;
}
#deviceInfo li{
	line-height: 22px;
}
#controlVideo{
	float: left;
	width: 24%;
}
#controlVideo ul{
	width: 100%;
	text-align: center;
}
#controlVideo li{
	background: #31b0d5;
	color:#fff;
	width: 30%;
	margin: 1%;
	border-radius: 5px;
}
.controlVideo-btn{
	moz-user-select:none;/*火狐*/
	-webkit-user-select:none;/*webkit浏览器*/
	-ms-user-select:none;/*IE10*/
	user-select:none;
	cursor: pointer;
}
.controlVideo-btn:hover{
	background: #1C87D5 !important;
}
#deviceList.light > li{
	text-align: center;
}